<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>这是第二课的第一个文件</title>
	</head>

	<body>
		<h1 align="center">HTML第二课-图片和路径</h1>
		<hr>
		<p>常见图片格式：</p>
		<p>jpg/jpeg/png/gif</p>
		<p>演示：</p>
		<div style="background:#ccc;">
			<img src="img/logo.png" alt="">
			<img src="img/logo.jpg" alt="">
			<img src="img/logo.gif" alt="">
		</div>

		<hr>
		<p>相对路径、绝对路径（※）：</p>
		<p>
			'./'  指 当前目录，<br>
			'../' 指 上级目录，<br>
			'dir/' 指 dir目录，<br>
		</p>
		<p>演示：</p>
		<div style="background:#ccc;">
			<p>相对路径</p>
			<img src="../img/logo/new/logo.png" alt="">
			<img src="./img/logo.png" alt="">
		</div>
		<div style="background:#ccc;">
			<p>绝对路径</p>
			<img src="/Applications/MAMP/htdocs/cub-study/html_20161105/img/logo.jpg" alt="">
			<img src="/Applications/MAMP/htdocs/cub-study/html_20161105/img/logo.png" alt="">
			<img src="http://c.hiphotos.baidu.com/image/h%3D200/sign=4c0450bad509b3def4bfe368fcbe6cd3/d1160924ab18972bce4df718e2cd7b899f510ae8.jpg" alt="">
		</div>

	</body>
</html>